﻿<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>ToDoList—最简单的待办事项列表</title>
    <link rel="stylesheet" href="css/index.css">
</head>

<body >
  
    <input type="text" id="text"></input>
    <button id="wancheng">完成事项</button>
    <ul>
       
    </ul>
    <a href="javascript:;">删除已完成项</a>
  <script>
    var text=document.querySelector('#text');
    var btn=document.querySelector('#wancheng');
    var ul=document.querySelector('ul');
    var i=0;
    var lii=new Array();
    btn.onclick=function(){
        if(text.value==''){
          return false;
        }
    else{
        console.log(text.value);
        var li=document.createElement('li');
        li.innerHTML="<input type='checkbox' id='checkb'></input>"+text.value;
        ul.appendChild(li);
        lii[i]=document.querySelector('li');
        i++;
     var as=document.querySelector('a');
    var aas=document.querySelectorAll('#checkb');
    as.onclick=function(){
    lii[i-1].remove();
 }
}
}      
 

  </script>    
</body>

</html>